Adwaita: add a transition to the switch slider

diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 7c45aa4381ebbd5a994dc0cbbf2211b0ba93a2a9..ae6c941adb9660c3f3cadff67d6231d770dcddd2 100644 (file)
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -5,6 +5,7 @@
 $ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
 $asset_suffix: if($variant=='dark', '-dark', '');
 $backdrop_transition: 200ms ease-out;
+$button_transition: all 200ms $ease-out-quad;
 
 * {
   padding: 0;
@@ -437,14 +438,13 @@ $_dot_color: if($variant=='light', $selected_bg_color,
 
 button {
   @at-root %button_basic, & {
-    $_button_transition: all 200ms $ease-out-quad;
 
     min-height: 24px;
     min-width: 16px;
     padding: 4px 8px;
     border: 1px solid;
     border-radius: 3px;
-    transition: $_button_transition;
+    transition: $button_transition;
 
     @include button(normal);
 
@@ -457,10 +457,10 @@ button {
       transition: none;
 
       &:hover {
-        transition: $_button_transition;
+        transition: $button_transition;
         transition-duration: 500ms;
 
-        &:active { transition: $_button_transition; }
+        &:active { transition: $button_transition; }
       }
     }
 
@@ -2459,6 +2459,8 @@ switch {
     min-height: 27px;
     border: 1px solid;
     border-radius: 3px;
+    transition: $button_transition;
+
     @include button(normal-alt, $edge: $shadow_color);
   }
 
@@ -2469,7 +2471,11 @@ switch {
   &:disabled slider { @include button(insensitive); }
 
   &:backdrop {
-    slider { @include button(backdrop); }
+    slider {
+      transition: $backdrop_transition;
+
+      @include button(backdrop);
+    }
 
     &:active slider { border-color: if($variant == 'light', $selected_bg_color, $selected_borders_color); }
 

diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 2a3abaa1e555c3bddb2b3c3b152908c83be597de..400fb161d8b7942439c36b955a25a650853a32bb 100644 (file)
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -2444,6 +2444,7 @@ switch {
     min-height: 27px;
     border: 1px solid;
     border-radius: 3px;
+    transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
     color: #eeeeec;
     outline-color: rgba(238, 238, 236, 0.3);
     border-color: #1c1f1f;
@@ -2468,6 +2469,7 @@ switch {
     switch:disabled slider label, switch:disabled slider {
       color: #949796; }
   switch:backdrop slider {
+    transition: 200ms ease-out;
     border-color: #1f2222;
     background-image: linear-gradient(to bottom, #393f3f);
     text-shadow: none;

diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 77c0002e57f310c6164489e051af674c93c921b3..7baa9a7e419a08934ae47fe9a7d684a112a19c47 100644 (file)
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -2457,6 +2457,7 @@ switch {
     min-height: 27px;
     border: 1px solid;
     border-radius: 3px;
+    transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
     color: #2e3436;
     outline-color: rgba(46, 52, 54, 0.3);
     border-color: #9d9d99;
@@ -2481,6 +2482,7 @@ switch {
     switch:disabled slider label, switch:disabled slider {
       color: #8b8e8f; }
   switch:backdrop slider {
+    transition: 200ms ease-out;
     border-color: #a5a5a1;
     background-image: linear-gradient(to bottom, #e8e8e7);
     text-shadow: none;